<template>
	<view class="contents" :style="'height:'+screenHeight+'px'">
		<view class="situationbody">
			<view class=" header">
				<view class="imglist">
					<view>
						<u-avatar :src="doctor.HeadImg" size='150'></u-avatar>
					</view>
					<view class="imgcount">
						<span class="name">{{doctor.DoctorName}}</span>
						<span class="tab">{{doctor.WorkType}}</span>

					</view>
					<view class="imgright">
						<span v-show="!collect"><u-icon name="heart" color="red" size="50"
								@click="collects"></u-icon></span>
						<span v-show="collect"><u-icon name="heart-fill" color="red" size="50"
								@click="qxcollect"></u-icon></span>
						<!-- <span class="number">0次预约</span> -->
						<span class="excessive" style="background-color: #0194fc;"
							v-if="excessive">有号</span>
						<span class="excessive" style="background-color: gray;" v-else>无号</span>
					</view>

				</view>

				<view class="buttons">
					{{doctor.Detai}}
				</view>
			</view>

			<view class="conter">
				<view class="">
					<span class="tiao">|</span>
					<span class="titles">擅长领域</span>
				</view>
				<view class="buttontext">
					{{doctor.WorkDuty}}
				</view>
			</view>

			<view class="Scheduling">
				<view class="">
					<span class="tiao">|</span>
					<span class="titles">排班情况</span>
				</view>
				<view class="lists" v-for="(item,index) in doctor.SpaceList" :key="index">
					<view class="letftext">
						<view style="padding-left: 10px;">
							<span style="font-weight: bold;">{{item.day}}</span>
							<span style="padding-left: 10px;">{{item.week}}</span>
							<span style="padding-left: 10px;">{{item.times}}</span>
						</view>
						<view style="padding-left: 10rpx;">
							<span>总号数：{{item.allNum}}</span>
							<span style="padding-left: 10px; color: gray;">余号：{{item.resideNum}}</span>
						</view>
					</view>
					<view class="righttext">
						<span class="excessive" style="background-color: #0194fc;" v-show="item.resideNum>0"
							@click="reservation(item)">预约</span>
						<span class="excessive" style="background-color: gray;" v-show="item.resideNum==0">排满</span>
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				screenHeight: getApp().globalData.screenHeight-88,
				show: false,
				excessive:false,
				collect: false,
				doctor: []
			}
		},
		onLoad: function(DutyId) {
			uni.showLoading({
				title: '加载中'
			})
			this.getDutyId(DutyId)

		},
		created() {

		},
		computed: {},
		methods: {
			async getDutyId(DutyId) {
				this.$request("Doctor", "TimeSpacelist", {
					DutyId: DutyId.DutyId
				}).then(res => {
					if (res.code == 1) {
						this.doctor = res.data[0]
						this.getOnecollection()
						uni.hideLoading();
						let item=res.data[0].SpaceList
						for (let i=0;i<item.length;i++){
							if(item[i].resideNum>0){
								this.excessive=true
								break
							}
						}
							console.log("doctor", this.doctor)
					} else {
						uni.hideLoading();
						uni.showToast({
							title: res.msg,
							icon: "none",
							duration: 2000,
						});
					}
				})
			},
			reservation(item) {

				let doctorinfor = JSON.stringify(item)
				let doctors = {
					DepartmentName: this.doctor.DepartmentName,
					DoctorName: this.doctor.DoctorName
				}
				let doctlist = JSON.stringify(doctors)
				//console.log("1",doctlist)
				uni.navigateTo({
					url: `/pages/block/Visit/Visit?doctorinfor=${doctorinfor}&doctlist=${doctlist}`,
					fail(error) {
						console.log(error)
					}
				})
			},
			showToast(params) {
				this.$refs.uToast.show({
					...params,
					complete() {
						params.url && uni.navigateTo({
							url: params.url
						})
					}
				})
			},
			getOnecollection() {
				this.$request("Collection", "Onecollection", {
					DoctorId: this.doctor.DoctorId
				}).then(res => {
					if (res.data >= 1) {
						this.collect = true
					} else {
						this.collect = false
					}
				})
			},
			collects() {

				this.$request("Collection", "Submit", {
					DoctorId: this.doctor.DoctorId
				}).then(res => {
					if (res.code == 1) {
						this.collect = true
						uni.showToast({
							title: "收藏成功",
							icon: "none",
							duration: 2000,
						});
					}
				})

			},
			qxcollect() {
				this.$request("Collection", "CancelCollection", {
					DoctorId: this.doctor.DoctorId
				}).then(res => {
					if (res.code == 1) {
						this.collect = false
						uni.showToast({
							title: "取消收藏",
							icon: "none",
							duration: 2000,
						});
					}
				})

			}
		}
	}
</script>

<style>
	@import './situation.css'
</style>